<template>
    <BasePieChart :data="chartData" :showLabel="false" :isDonut="true" height="12rem" />
</template>

<script setup>
import { computed } from 'vue'
import BasePieChart from '@/components/chart/BasePieChart.vue'

const props = defineProps({
    type: {
        type: String,
        default: 'type'  // 'type' 或 'area'
    },
    alarms: {
        type: Array,
        default: () => []
    }
})

// 根据类型统计数据
const typeData = computed(() => {
    const stats = {}
    props.alarms.forEach(alarm => {
        if (!stats[alarm.type]) {
            stats[alarm.type] = 0
        }
        stats[alarm.type]++
    })

    return Object.entries(stats).map(([name, value]) => ({
        value,
        name
    }))
})

// 根据区域统计数据
const areaData = computed(() => {
    const stats = {}

    for (let i = 0; i < props.alarms.length; i++) {
        const alarm = props.alarms[i]

        if (alarm.area === '-') {
            continue
        }
        if (!stats[alarm.area]) {
            stats[alarm.area] = 0
        }
        stats[alarm.area]++

    }

    return Object.entries(stats).map(([name, value]) => ({
        value,
        name
    }))
})

// 图表数据
const chartData = computed(() =>
    props.type === 'type' ? typeData.value : areaData.value
)

// 单位
</script>